// 本组件是收入类合同的
<template>
  <div>
    <el-table :border="false" :data="tableList" class="new-table-style">
      <!-- 描述说明 -->
      <el-table-column v-if="contractType == 'LSCD' || contractType == 'WRSB' || contractType == 'QTSR'" align="center" :label="descName" width="300">
        <template slot-scope="scope">
          <span class="one-line-ellipsis" v-tooltip.content="scope.row.remark">{{ scope.row.remark }}</span>
        </template>
      </el-table-column>

      <!-- 资产(可租空间 ｜ 广告位 ｜ 活动空间 ｜ 收入类型) -->
      <el-table-column v-if="contractType != 'WRSB'" align="center" :label="assetName" :min-width="fixWidth" prop="assetName"></el-table-column>

      <el-table-column v-if="contractType == 'ZL' || contractType == 'TCCYY'" align="center" label="交付时间" :width="fixWidth">
        <template slot-scope="scope">
          <span>{{ scope.row.deliveryDate | formatDateTime('YYYY-MM-DD') }}</span>
        </template>
      </el-table-column>

      <el-table-column align="center" label="起租时间" :min-width="fixWidth">
        <template slot-scope="scope">
          <span>{{ scope.row.rentStartDate | formatDateTime('YYYY-MM-DD') }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="退租时间" :min-width="fixWidth">
        <template slot-scope="scope">
          <span>{{ scope.row.rentEndDate | formatDateTime('YYYY-MM-DD') }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="付款方式" width="120" prop="paymentMethod">
        <template slot-scope="scope">
          <span>{{ getPaymentMethodNmae(scope.row.paymentMethod) }}</span>
        </template>
      </el-table-column>

      <template v-if="contractType == 'ZL' || contractType == 'TCCYY'">
        <el-table-column align="center" width="120" :label="item.value" v-for="item in subsidyTypeList" :key="item.key">
          <template slot-scope="scope">
            <span>{{ scope.row[item.key] | moneyFilterNoUnit }}</span>
          </template>
        </el-table-column>
      </template>

      <el-table-column v-if="isEdit" align="center" fixed="right" label="操作" width="80">
        <template slot-scope="scope">
          <el-button icon="el-icon-edit" class="normal-btn" size="mini" type="text" @click="editItem(scope.row)"></el-button>
          <el-button icon="el-icon-delete" class="normal-btn color-red" size="mini" type="text" @click="deleteItem(scope.$index)"></el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  import Bus from '@js/bus.js';
  import { askDialog } from '@/pages/limit/assets/util';

  export default {
    props: {
      contractType: {
        type: String,
        default: '',
      },
      tableList: {
        type: Array,
        default: () => {
          return [];
        },
      },
      isEdit: {
        type: Boolean,
        default: true,
      },
      //付款方式
      paymentMethodList: {
        type: Array,
        default: () => {
          return [];
        },
      },
      //补贴事项类型
      subsidyTypeList: {
        type: Array,
        default: () => {
          return [];
        },
      },
    },

    computed: {
      assetName() {
        let contractTypeList = ['ZL', 'GGZL', 'LSCD', 'WRSB', 'TCCYY', 'QTSR'];
        let assetNameList = ['可租空间', '广告', '租赁事项', '', '可租空间', '收入类型'];
        let index = contractTypeList.indexOf(this.contractType);
        return assetNameList[index];
      },
      descName() {
        let contractTypeList = ['LSCD', 'WRSB', 'QTSR'];
        let descNameList = ['租赁场地说明', '无人设备说明', '经营事项说明'];
        let index = contractTypeList.indexOf(this.contractType);
        return descNameList[index];
      },
      fixWidth() {
        return this.contractType == 'ZL' || this.contractType == 'TCCYY' ? 120 : null;
      },
    },

    data() {
      return {};
    },

    mounted() {},

    methods: {
      editItem(costItem) {
        let row = this.lodash.cloneDeep(costItem);
        //只有租赁 ｜ 代运营合同有营销成本
        if (this.contractType == 'ZL' || this.contractType == 'TCCYY') {
          this.subsidyTypeList.forEach(item => {
            for (let i in row) {
              if (i == item.key) {
                delete row[i];
              }
            }
          });
        }
        Bus.$emit('costItem', row);
      },

      deleteItem(index) {
        askDialog('确认删除？', async () => {
          this.$emit('deleteItem', index);
        });
      },

      getPaymentMethodNmae(key){
        let target = this.paymentMethodList.find(item => item.key == key)
        return target ? target.value : ""
      }
    },
  };
</script>

<style lang="scss" scoped></style>
